<style lang="less">
    @import '../../styles/common.less';
     .map {
            height: 620px;
            width: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }
        .panel-table{
        	height:265px;
        	overflow: hidden;
        }
</style>
<template>
	<div>
		<Row class="margin-top-10">
			<Col span="24">
				<Card>
					<p slot="title">实时跟踪</p>
					<Row>
						<Col span="18">
							<img width="100%" style="display: block; height: 500px;" src="../../images/34.png" alt="">
						</Col>
						<Col span="6">
							<div style="height: 250px;">
								<img width="100%" src="../../images/7835.png" alt="">
							</div>
							<div id="allmap" class="map" style="height: 250px;"></div>
						</Col>
					</Row>
					<Row style="height: 220px;">
						<Col span="6"style="height: 200px;">
							<p style="text-align: center;">实时成绩</p>
							<div class="panel-table">
								<ul>
									<li v-for="item in realTimeList" style="height: 32px;">
										<a>{{item.teamName}}</a><span style="float: right;">{{item.scenesScore}}分</span>									
									</li>
								</ul>
							</div>
						</Col>
						<Col span="12"style="height: 200px;">
							<p style="text-align: center;">行驶平稳性数据分析</p>
							<service-requests></service-requests>
						</Col>
						<Col span="6"style="height: 200px;">
							<div class="data-source-row" style="height: 100%;">
		                        <user-flow></user-flow>
		                    </div>
						</Col>
					</Row>
				</Card>
			</Col>
		</Row>
	</div>
</template>
<!--<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1e0u2fDgqYhUdilCb10Lz7xHyTBf99hG"></script>-->
<script>
import tableData from './achieve_table_data.js';
import tableData2 from './illegal_table_data.js';
import userFlow from './components/userFlow.vue';
import serviceRequests from './components/serviceRequests.vue';
import {baseurl} from '../../libs/util.js';
export default {
    name: 'actually_index',
    components: {
        userFlow,
        serviceRequests,
    },
    
    data () {
      return {
      	realTimeList:[],
      	illegalList:[]
      	
      }
    },
    mounted () {
      this.initMap()
    },
    created(){
    	window.open('http://www.baidu.com');
    },
     created () {
        this.realTimeList=tableData.editInlineData;
        this.illegalList=tableData2.editInlineData
    },
    methods: {
      initMap () {
        var map = new BMap.Map("allmap");//在百度地图容器中创建一个地图
        var point = new BMap.Point(120.7883557890, 31.5949345961);//定义一个中心点坐标
        map.centerAndZoom(point,17);//设定地图的中心点和坐标并将地图显示在地图容器中
        map.addControl(new BMap.MapTypeControl());   //添加地图类型控件
        map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
//      window.map = map;//将map变量存储在全局
        
        //initRealTime(); //实时成绩；
        //initIllegal(); //违规信息

      },
      initRealTime : function(pageNo){
		var _self = this;
        $.ajax({
            type: "get",
            url: baseurl + 'scenesResults',
            async: false,
            data:{
				"currentPage":1,
				"pageSize":999,
			},  
            async: false,
            dataType: 'json',
            contentType: "application/json; charset=utf-8",
            beforeSend: function (request) {
                request.setRequestHeader("accessToken", accessToken);
            },
            success: function (data) {
            	if(data.code == 1){
					var result = data.result;
					_self.realTimeList  = result;
            	}
            }
		});
		},
		
		initIllegal : function(pageNo){
    		var _self = this;
                $.ajax({
                    type: "get",
                    url: baseurl + 'illegalResults',
                    async: false,
                    data:{
						"currentPage":1,
						"pageSize":999,
					},  
                    async: false,
                    dataType: 'json',
                    contentType: "application/json; charset=utf-8",
                    beforeSend: function (request) {
                        request.setRequestHeader("accessToken", accessToken);
                    },
                    success: function (data) {
                    	if(data.code == 1){
							var result = data.result;
							_self.illegalList = result;
                    	}
                    }
        		});
		},
      goAchieve(){
      	this.$router.push({
      		name:'achieve_index'
      	})     	
      },
      goIllegal(){
      	this.$router.push({
      		name:'illegal_index'
      	})     	
      },
    
    }   
    
};
</script>
